<template>
    <div>
<<<<<<< HEAD
        <h3>门组管理</h3>
        <div style="margin-left: 10px;margin-bottom: 10px">
            <el-input type="text" placeholder = "请输入门组名称" style="width: 400px;margin-right: 10px"></el-input>
            <el-button type="primary" size="small">查询</el-button><br>
            <el-button type="primary" size="small" @click="isAddFormShow">添加门组</el-button>
=======
        <div style="margin: 10px">
            <el-input v-model="query.name" type="text" placeholder = "请输入门组名称" style="width: 400px;margin-right: 10px"></el-input>
            <el-button type="primary" @click="getDoorGroupByName">查询</el-button><br>
            <el-button style="margin-top: 10px" type="primary" size="small" @click="isAddFormShow">添加门组</el-button>
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
            <el-button type="danger" size="small" @click="deleteDoorGroupBatch">批量删除门组</el-button>
        </div>
        <div style="margin-left: 10px">
            <el-table
                    :data="doorGroupData"
                    border
                    style="width: 80%"
                    @selection-change="handleSelectionChange">
                <el-table-column
                        type="selection"
                        width="55">
                </el-table-column>
                <el-table-column
                        prop="id"
                        label="门组id"
                        width="150">
                </el-table-column>
                <el-table-column
                        prop="name"
                        label="门组名称"
<<<<<<< HEAD
                        width="120">
=======
                        width="200">
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
                </el-table-column>
                <el-table-column
                        prop="memo"
                        label="备忘录"
<<<<<<< HEAD
                        width="120">
=======
                        width="200">
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
                </el-table-column>
                <el-table-column
                        prop="hasChildChannel"
                        label="是否有子通道"
                        width="120">
                    <template slot-scope="scope">
                        <el-tag :type="scope.row.hasChildChannel === true ? 'success':'info'">
                            {{scope.row.hasChildChannel == true ?'是':'否'}}
                        </el-tag>
                    </template>
                </el-table-column>
                <el-table-column
                        fixed="right"
<<<<<<< HEAD
                        label="操作">
=======
                        label="操作"
                        width="320">
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
                    <template slot-scope="scope">
                        <el-button @click="showAuthority(scope.row)" type="primary" size="small">查看门组权限</el-button>
                        <el-button @click="isUpdateFormShow(scope.row)" type="primary" size="small">修改门组</el-button>
                        <el-button @click="deleteDoorGroup(scope.row)" type="danger" size="small">删除门组</el-button>
                    </template>
                </el-table-column>
            </el-table>
<!--            @size-change="handleSizeChange"-->
<!--            @current-change="handleCurrentChange"-->
<<<<<<< HEAD
            <div class="block">
=======
            <div class="block" style="margin-top: 10px">
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
                <el-pagination
                        :current-page="currentPage"
                        :page-sizes="[10, 20, 50, 100]"
                        :page-size="pageSize"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="total">
                </el-pagination>
            </div>
        </div>
        <el-dialog
                title="门组权限"
                :visible.sync="isDialogShow"
                width="50%"
                center>
                <span>门组中的通道集合</span>
                <el-table :data="doorData.doorGroupDetail">
                    <el-table-column property="id" label="门组编号" width="80"></el-table-column>
                    <el-table-column property="channelCode" label="通道编码" width="150"></el-table-column>
                    <el-table-column property="channelName" label="通道名称" width="100"></el-table-column>
                    <el-table-column property="deviceCode" label="设备编码" width="100"></el-table-column>
                    <el-table-column property="deviceName" label="设备名称" width="100"></el-table-column>
                    <el-table-column property="deviceStatus" label="设备状态" width="100"></el-table-column>
                </el-table>
                <el-button type="primary" @click="isDialogShow = false">确 定</el-button>
        </el-dialog>
<<<<<<< HEAD
=======

>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
        <el-dialog
                title="添加门组"
                :visible.sync="isAddDialogShow"
                width="50%"
                center>
<<<<<<< HEAD
            <el-form label-position="rigth" label-width="80px" :model="addFormData">
=======
            <el-form label-position="right" label-width="80px" :model="addFormData">
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
                <el-form-item label="门组名称">
                    <el-input v-model="addFormData.name"></el-input>
                </el-form-item>
                <el-form-item label="备注">
                    <el-input v-model="addFormData.memo"></el-input>
                </el-form-item>
                <el-form-item label="门禁通道点编码集合">
                    <el-input type="textarea" v-model="addFormData.doorGroupDetail"></el-input>
                </el-form-item>
            </el-form>
            <el-button type="primary" @click="addDoorGroup">确 定</el-button>
        </el-dialog>

<<<<<<< HEAD
=======
        <el-dialog
                title="修改门组"
                :visible.sync="isUpdateDialogShow"
                width="50%"
                center>
            <el-form label-position="rigth" label-width="80px" :model="updateFormData">
                <el-form-item label="门组名称">
                    <el-input v-model="updateFormData.name"></el-input>
                </el-form-item>
                <el-form-item label="备注">
                    <el-input v-model="updateFormData.memo"></el-input>
                </el-form-item>
                <el-form-item label="新增的通道点编码">
                    <el-input type="textarea" v-model="updateFormData.addDoorGroupRelDoorList"></el-input>
                </el-form-item>
                <el-form-item label="删除的通道点编码">
                    <el-input type="textarea" v-model="updateFormData.deleteDoorGroupRelDoorList"></el-input>
                </el-form-item>
            </el-form>
            <el-button type="primary" @click="updateDoorGroup">确 定</el-button>
        </el-dialog>
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
    </div>
</template>

<script>
<<<<<<< HEAD
  import {getAllDoorGroup, getDoorGroupById, deleteDoorGroupByIds, updateDoorGroup} from '@/api/doorgroup'
=======
  import {getAllDoorGroup, getDoorGroupById, deleteDoorGroupByIds, updateDoorGroup, addDoorGroup} from '@/api/doorgroup'
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f

  export default {
    name: 'DoorGroup',
    data(){
      return {
        query: {
          name: ''
        },
        doorGroupData:[
          {
<<<<<<< HEAD
            id: 1,
            name:'TTT',
            memo:'test',
            hasChildChannel:true
          },
          {
            id: 2,
            name:'TTT',
            memo:'test',
            hasChildChannel:true
          },
          {
            id: 3,
            name:'TTT',
            memo:'test',
            hasChildChannel: false
          },
          {
            id: 4,
            name:'TTT',
            memo:'test',
            hasChildChannel: true
          },
          {
            id: 5,
            name:'TTT',
            memo:'test',
            hasChildChannel: false
          },
=======
            id: 0,
            name: '',
            memo: '',
            hasChildChannel: true
          }
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
        ],
        currentPage: 1,
        total: 0,
        pageSize: 10,
        isDialogShow: false,
        isAddDialogShow: false,
<<<<<<< HEAD
=======
        isUpdateDialogShow: false,
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
        doorData: {
          id: '',
          name: '',
          memo: '',
          hasChildChannel: true,
          doorGroupDetail:[
            {
<<<<<<< HEAD
                channelCode: '1000001$7$0$0',
                channelName: '132_通道1',
                deviceCode: '1000001',
                deviceName: '132',
                deviceStatus: 'ON',
                groupId: '5',
                id: '4',
                online: '1',
                orgName:'根节点'
            },
            {
              channelCode: '1000001$7$0$0',
              channelName: '132_通道1',
              deviceCode: '1000001',
              deviceName: '132',
              deviceStatus: 'ON',
              groupId: '5',
              id: '4',
              online: '1',
              orgName:'根节点'
            },
            {
              channelCode: '1000001$7$0$0',
              channelName: '132_通道1',
              deviceCode: '1000001',
              deviceName: '132',
              deviceStatus: 'ON',
              groupId: '5',
              id: '4',
              online: '1',
              orgName:'根节点'
=======
                channelCode: '',
                channelName: '',
                deviceCode: '',
                deviceName: '',
                deviceStatus: '',
                groupId: 5,
                id: 4,
                online: 1,
                orgName:''
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
            }
          ]
        },
        multipleSelection: [],
        addFormData: {
          name: '',
          memo: '',
          doorGroupDetail: [
            {
              channelCode: ''
            }
          ]
<<<<<<< HEAD
        }
      }
    },
    created(){
        // this.initData()
=======
        },
        updateFormData:{
          id: '',
          name: '',
          memo: '',
          addDoorGroupRelDoorList: [],
          deleteDoorGroupRelDoorList: []
        },
        channelCombined:[]
      }
    },
    created(){
      this.initData()
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
    },
    methods:{
      initData(){
        let query = {
          "pageNum": this.currentPage,
<<<<<<< HEAD
          "pageSize": this.pageSize
=======
          "pageSize": this.pageSize,
          "name": this.query.name
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
        }
        getAllDoorGroup(query).then(resp => {
          if(resp){
            this.doorGroupData = resp.data.pageData
            this.total = resp.data.totalRows
          }
        })
      },
<<<<<<< HEAD
      showAuthority(row){
        this.isDialogShow = true;
        // getDoorGroupById(row.id).then(resp => {
        //   if(resp){
        //     this.isDialogShow = true;
        //     this.doorData = resp.data
        //   }
        // })
      },
      updateDoorGroup(row){
        // updateDoorGroup().then(resp => {
        //
        // })
=======
      getDoorGroupByName(){
        this.initData()
      },
      isAddFormShow(){
        this.isAddDialogShow = true;
      },
      addDoorGroup(){
        addDoorGroup(this.addFormData).then(resp => {
          if(resp) {
            this.initData()
            this.$message({
              type: 'success',
              message: '添加成功'
            });
            this.addFormData = { }
            this.isAddDialogShow = false;
          }
        })
      },
      showAuthority(row){
        this.isDialogShow = true;
        getDoorGroupById(row.id).then(resp => {
          if(resp){
            console.log(resp.data)
            this.isDialogShow = true;
            this.doorData.doorGroupDetail = resp.data.doorGroupDetail
          }
        })
      },
      isUpdateFormShow(row){
        this.isUpdateDialogShow = true;
        this.updateFormData = row;
      },
      updateDoorGroup(){
        updateDoorGroup(this.updateFormData).then(resp => {
          if(resp) {
            // this.doorGroupData.forEach()
            this.initData()
            this.$message({
              type: 'success',
              message: '修改成功!'
            });
            this.isUpdateDialogShow = false;
          }
        })
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
      },
      deleteDoorGroup(row){
        this.$confirm('此操作将永久删除' + row.id + '号门组, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          let ids = [row.id]
<<<<<<< HEAD
          // deleteDoorGroupByIds(ids).then(resp => {
          //   if(resp.success == true){
          //     this.$message({
          //       type: 'success',
          //       message: '删除成功!'
          //     });
          //   }
          // })
=======
          deleteDoorGroupByIds(ids).then(resp => {
            if(resp){
              this.initData()
              this.$message({
                type: 'success',
                message: '删除成功!'
              });
            }
          })
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },
      handleSelectionChange(rows){
        this.multipleSelection = rows;
        console.log(this.multipleSelection)
      },
      deleteDoorGroupBatch(){
        this.$confirm('此操作将永久删除您选中的' + this.multipleSelection.length + '个门组, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          let ids = []
          this.multipleSelection.forEach((item) =>{
            ids.push(item.id)
          })
          console.log(ids)
<<<<<<< HEAD
          // deleteDoorGroupByIds(ids).then(resp => {
          //   if(resp.success == true){
          //     this.$message({
          //       type: 'success',
          //       message: '删除成功!'
          //     });
          //   }
          // })
=======
          deleteDoorGroupByIds(ids).then(resp => {
            if(resp){
              this.initData()
              this.$message({
                type: 'success',
                message: '删除成功!'
              });
            }
          })
>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },
<<<<<<< HEAD
      isAddFormShow(){
        this.isAddDialogShow = true;
      },
      addDoorGroup(){


        this.isAddDialogShow = false;
=======
      getChannelCombined(){

>>>>>>> 9bd91f7cdea89e78ee433b17f8909db13645484f
      }
    }
  }
</script>

<style scoped>

</style>
